import React, { Component } from 'react';
import style from './index.module.scss'
import { Swiper } from 'antd-mobile'
import { getDetailApi } from '@/api/Details'
import { withRouter } from 'react-router-dom';


class Index extends Component {

    state = {
        bannerList: [],
        goodsDetail: {},
        id: ""
    }

    componentDidMount() {

        this.getBanner()
    }


    async getBanner() {
        let res = await getDetailApi({ goodid: this.props.match.params.id })
        if (res.data.code === 200) {
            this.setState({
                bannerList: res.data.goodinfo.pics,
            })
        }
    }


    render() {

        return (
            <div className={style.banner}>
                <Swiper loop autoplay  >
                    {
                        this.state.bannerList.map((item, index) => (
                            <Swiper.Item key={index}>
                                <div className={style.content}>
                                    {<img className={style.image} src={item} alt={item.name} />}
                                </div>
                            </Swiper.Item>
                        ))
                    }
                </Swiper>
            </div>
        );
    }
}

export default withRouter(Index);